<template>
  <el-table :height="calTableHeight()" ref="TableRef" :data="data" row-key="menuId">
    <!-- 租户 sku 图片 名字 申请时间 总价 模板完成状态 更新时间 是否付款 是否验收 操作 -->
    <el-table-column align="center" show-overflow-tooltip prop="distrName" :label="$t('租户')" width="150" />
    <el-table-column align="center" show-overflow-tooltip prop="type" :label="$t('类型')" width="100">
      <template slot-scope="{ row }">
        <!-- type	类型 1-单品sku 2-组合sku -->
        <div v-if="row.type == 1" :style="{ color: $randomColor(row.type) }">
          {{ $t('单品sku') }}
        </div>
        <div v-if="row.type == 2" :style="{ color: $randomColor(row.type) }">
          {{ $t('组合sku') }}
        </div>
      </template>
    </el-table-column>
    <el-table-column align="center" show-overflow-tooltip prop="skuNo" :label="$t('单品sku')" width="120">
      <template slot-scope="scope">
        <div @click="handleEdit(scope.row)" style="cursor: pointer; color: #1890ff">
          {{ scope.row.skuNo }}
        </div>
      </template>
    </el-table-column>

    <el-table-column align="center" show-overflow-tooltip prop="combinationName" :label="$t('组合名')" width="120" />
    <el-table-column align="center" prop="imgUrl" :label="$t('图片')">
      <template slot-scope="scope">
        <div>
          <el-image
            :key="Math.random()"
            v-hover="scope.row.imgUrl"
            style="width: 50px; height: 50px"
            fit="contain"
            :src="scope.row.imgUrl + '?x-oss-process=image/resize,w_100/quality,q_70'"
          />
        </div>
      </template>
    </el-table-column>
    <el-table-column align="center" show-overflow-tooltip prop="skuNameCn" :label="$t('名字')" width="150" />
    <el-table-column align="center" show-overflow-tooltip prop="isPay" :label="$t('是否付款')" width="80">
      <!-- isPay	是否付款 0-否 1-是 -->
      <template #default="{ row }">
        <div v-if="row.isPay == 0" style="color: red">{{ $t('否') }}</div>
        <div v-if="row.isPay == 1" style="color: green">{{ $t('是') }}</div>
      </template>
    </el-table-column>
    <el-table-column align="center" show-overflow-tooltip prop="isAcceptance" :label="$t('是否验收')" width="80">
      <!-- isAcceptance	是否验收 0-否 1-是 -->
      <template #default="{ row }">
        <div v-if="row.isAcceptance == 0" style="color: red">{{ $t('否') }}</div>
        <div v-if="row.isAcceptance == 1" style="color: green">{{ $t('是') }}</div>
      </template>
    </el-table-column>
    <el-table-column align="center" show-overflow-tooltip prop="num" :label="$t('申请数量')" />
    <el-table-column align="center" show-overflow-tooltip prop="completeStatus" :label="$t('模板完成数量')" />
    <el-table-column align="center" show-overflow-tooltip prop="createTime" :label="$t('申请时间')" width="150" />
    <el-table-column align="center" show-overflow-tooltip prop="updateTime" :label="$t('更新时间')" width="150" />
  </el-table>
</template>
<script>
export default {
  activated() {},
  props: {
    /**
     * data
     */
    data: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {}
  },
  computed: {},
  methods: {
    handleSum(param) {},

    cancel() {
      this.$emit('update:show', false)
    },
  },
}
</script>
<style lang="scss" scoped></style>
